<template>
  <div class="activebox">
    <div class="activebox_con">
      <el-icon name="close" class="closeicon" @click="active()" ><CircleClose /></el-icon>
<!--      <van-icon name="close" class="closeicon" @click="active()" />-->
      <div class="activebox_head">
        <img
          data-v-089c6eaf=""
          src="../assets/img/image/header.png"
          alt="coupon-new-user-header"
          class="dialog-header-v2__img"
        />
        <div data-v-089c6eaf="" class="dialog-header-v2__title">
          <h2 data-v-089c6eaf="">Tailored Product Selection Guidance</h2>
        </div>
      </div>
      <div class="activebox_cen">
        <div class="coupon__main">
          <div data-v-330a38b6="" class="new-user__label">
            <div data-v-330a38b6="" class="new-user__text">
              <!-- {{ $t('content.ActiveHome2') }} -->
              LinkBuy
            </div>
          </div>
 
          <div class="coupon__main_p1">
<!--            <svg t="1725270326967" class="icon" viewBox="0 0 1165 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="106398" width="30" height="30"><path d="M1045.707084 843.468208l-78.921001 175.599229h-157.842004l70.042389-113.44894s21.703276-40.447013-7.8921-125.28709l174.612716 63.136801z" fill="#47957F" p-id="106399"></path><path d="M969.74562 1024H800.065466l74.974952-121.34104s20.716763-39.460501-7.8921-120.354528l-3.94605-9.865126 189.410404 68.069365-82.867052 183.491329z m-151.922929-9.865125h146.003854l75.961464-167.707129L879.97298 789.210019c25.649326 78.921002 4.932563 117.39499 3.946051 119.368016l-66.09634 105.55684z" p-id="106400"></path><path d="M1158.169512 688.585742s-2.959538 161.788054-113.44894 162.774566l-235.776493-73.001926s174.612717-31.568401 170.666666-268.331407v-7.8921l178.558767 186.450867z" fill="#47957F" p-id="106401"></path><path d="M1043.734059 856.292871l-236.763005-73.001927 0.986512-9.865125c6.905588-0.986513 170.666667-33.541426 166.720617-263.398844v-20.716763l188.423892 197.302505v1.973025c0 1.973025-4.932563 166.720617-119.368016 167.707129z m-218.019267-77.934489l219.00578 68.069364c97.66474-1.973025 107.529865-137.125241 107.529865-155.868979l-167.707129-176.585742c0.986513 191.38343-114.435453 249.587669-158.828516 264.385357z" p-id="106402"></path><path d="M900.689743 399.537572s-96.678227 303.845857-256.493256 358.104046l240.709056 62.15029s164.747592-61.163776 140.084778-264.385357L900.689743 399.537572z" fill="#E65E6C" p-id="106403"></path><path d="M885.892056 824.72447l-258.466282-67.082852 15.784201-4.932562c155.868979-52.285164 252.547206-351.198459 253.533718-354.157996l2.959538-8.878613 131.206166 163.761079v0.986513c25.649326 204.208092-141.071291 269.317919-143.044316 269.317919l-1.973025 0.986512z m-224.924856-68.069364l224.924856 58.204239c16.770713-6.905588 157.842004-69.055877 135.152215-257.479769l-118.381503-146.990366c-16.770713 48.339114-102.597303 285.102119-241.695568 346.265896z" p-id="106404"></path><path d="M822.755254 99.637765c-126.273603-78.921002-324.56262 9.865125-443.930636 199.27553s-113.44894 406.44316 12.824663 486.350674 324.56262-9.865125 443.930636-199.27553S949.028857 178.558767 822.755254 99.637765z" fill="#E65E6C" p-id="106405"></path><path d="M496.219609 818.805395c-38.473988 0-74.974952-9.865125-107.529866-29.595376-62.150289-39.460501-98.651252-112.462428-100.624277-206.181117-1.973025-92.732177 28.608863-194.342967 85.82659-287.075145C495.233096 104.570328 696.481651 14.797688 824.728279 95.691715s135.152216 301.872832 14.797688 493.256262c-89.77264 143.044316-226.897881 229.857418-343.306358 229.857418zM718.184926 75.961464c-113.44894 0-246.628131 84.840077-334.427745 225.911368-57.217726 90.759152-86.813102 190.396917-84.840077 281.15607 1.973025 89.77264 36.500963 160.801541 95.691715 198.289017 123.314066 77.934489 319.630058-10.851638 437.025048-197.302505C949.028857 396.578035 943.109782 181.518304 819.795716 103.583815c-30.581888-18.743738-65.109827-27.622351-101.61079-27.622351z" p-id="106406"></path><path d="M758.63194 201.248555c-88.786127-55.244701-227.884393 6.905588-311.737958 140.084778S366.986468 627.421965 455.772595 682.666667s227.884393-6.905588 311.737958-140.084779 79.907514-285.102119-8.878613-341.333333z" fill="#D93357" p-id="106407"></path><path d="M528.774522 708.315992c-27.622351 0-53.271676-6.905588-75.961465-20.716763-90.759152-57.217726-95.691715-213.086705-10.851637-348.238921 41.433526-65.109827 96.678227-115.421965 155.868979-142.057803 60.177264-26.635838 118.381503-26.635838 162.774566 0.986512 44.393064 27.622351 70.042389 79.907514 71.028902 146.003854 1.973025 65.109827-19.73025 137.125241-61.163777 202.235067-62.150289 100.624277-158.828516 161.788054-241.695568 161.788054z m155.868979-522.851637c-25.649326 0-53.271676 5.919075-81.88054 18.743737-58.204239 25.649326-111.475915 74.974952-151.922929 139.098266-81.880539 130.219653-78.921002 280.169557 7.892101 334.427746 85.82659 54.258189 222.95183-7.8921 304.83237-138.111753 39.460501-63.136802 61.163776-133.179191 59.190751-197.302505-1.973025-63.136802-25.649326-111.475915-67.082852-138.111754-20.716763-11.83815-44.393064-18.743738-71.028901-18.743737z" p-id="106408"></path><path d="M796.119416 477.472062s-157.842004-144.030829-319.630058-0.986513c0 0-45.379576 58.204239 21.703276 83.853565 0 0 84.840077 17.757225 146.003853-25.649326 0 0 61.163776-40.447013 102.597303 23.676301 0.986513 0 37.487476-21.703276 49.325626-80.894027z" fill="#F8E55E" p-id="106409"></path><path d="M540.612672 569.217726c-24.662813 0-41.433526-3.94605-43.406551-3.94605-21.703276-8.878613-34.527938-20.716763-38.473988-36.500963-6.905588-27.622351 13.811175-54.258189 14.797687-55.244701 164.747592-144.030829 325.549133-0.986513 326.535646 0.986512l1.973025 1.973025-0.986513 1.973025c-11.83815 61.163776-49.325626 83.853565-51.298651 84.840077l-3.94605 1.973025-2.959537-3.94605c-15.7842-24.662813-37.487476-36.500963-62.150289-33.541426-18.743738 1.973025-33.541426 10.851638-34.527939 10.851638-33.541426 24.662813-74.974952 30.581888-105.55684 30.581888z m-40.447013-12.824662s82.867052 16.770713 142.057803-25.649326c0.986513-0.986513 28.608863-18.743738 60.177264-11.83815 17.757225 3.94605 33.541426 14.797688 46.366089 32.554913 8.878613-6.905588 32.554913-28.608863 42.420038-73.001927-19.73025-16.770713-161.788054-130.219653-310.751445 0.986513 0 0-17.757225 23.676301-11.83815 46.366088 2.959538 12.824663 13.811175 22.689788 31.568401 30.581889z" p-id="106410"></path><path d="M320.620379 6.905588l-90.759152 46.366088 108.516378 177.572255 20.716763-17.757226L320.620379 6.905588z" fill="#CC3300" p-id="106411"></path><path d="M337.391092 238.736031L222.955639 52.285164 324.566429 0l40.447014 215.05973L337.391092 238.736031zM236.766815 55.244701l102.597302 167.707129 13.811176-11.83815L317.660842 14.797688l-80.894027 40.447013z" p-id="106412"></path><path d="M13.814984 386.712909l4.932563 101.61079 206.181117-25.649325-7.8921-26.635838-203.22158-49.325627z" fill="#CC3300" p-id="106413"></path><path d="M13.814984 494.242775L7.895909 380.793834l213.086705 52.285164 9.865126 34.527938-217.032756 26.635839z m4.932563-100.624278l4.932563 89.77264L219.009589 459.714836l-4.932562-17.757225-195.32948-48.339114z" p-id="106414"></path><path d="M76.951786 88.786127l-70.042389 118.381503L258.47009 332.454721l10.851638-35.514451L76.951786 88.786127z" fill="#CC3300" p-id="106415"></path><path d="M261.429628 339.360308L0.003809 209.140655 75.965273 79.907514l198.289018 215.059731-12.824663 44.393063zM13.814984 205.194605l241.695569 120.354528 7.8921-26.635838L77.938298 96.678227l-64.123314 108.516378z" p-id="106416"></path></svg>-->
            <span style="width: 90%">Enjoy a three-month free trial! Get started now and experience personalized one-on-one expert guidance to help you monetize.</span>

          </div>
          <!-- <div class="coupon__main_p2">{{ $t('content.ActiveHome4') }}</div> -->
        </div>
      </div>
      <!-- 按钮-->
      <div class="activebox_bot" style="cursor: pointer;">
        <span @click="show()" class="show">Contact Us Now</span>
        <div class="click-hand"></div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  mounted() {},
  methods: {
    active() {
      this.$emit("close");
    },
    show() {
      this.$emit("gowhapp");
    },
  },
};
</script>

<style scoped>
* {
  box-sizing: border-box;
}
.activebox {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  background: rgba(0, 0, 0, 0.8);
  z-index: 99999;
}
.activebox_con {
  width: 321px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0 auto;
  max-width: 321px;
  max-height: 321px;
}
.dialog-header-v2__img {
  width: 100%;
  position: absolute;
  top: -70px;
}
.dialog-header-v2__title {
  width: 100%;
  padding: 0 6px;
}
.dialog-header-v2__title h2 {
  text-align: center;
  color: #a63e00;
  flex: 1;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  word-wrap: break-word;
  -webkit-line-clamp: 2;
  //text-transform: math-auto;
  font-weight: 860;
  margin: 0;
}
.activebox_head {
  background: linear-gradient(179deg, #ffe2cc 0.47%, #fff 99.51%);
  border-radius: 8px 8px 0 0;
  padding: 13px 0 10px;
}
.activebox_bot {
  margin-top: -1px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  padding: 11px 0 18px;
  text-align: center;
  background-color: #fff;
  position: relative;
}
.activebox_bot span {
  margin: auto;
  border-width: 0;
  border-radius: 24px;
  padding: 0 22px;
  background-color: #222;
  width: 220px;
  height: 48px;
  line-height: 48px;
  font-weight: 700;
  word-break: break-word;
  color: #fff;
  display: inline-block;
  font-size: 14px;
}
.activebox_cen {
  margin-top: -1px;

  background-color: #fff;
  padding: 20px 19.5px;
}
.coupon__main {
  position: relative;
  padding: 15px 10px 15px;
  border: solid #ffe2cf;
  border-width: 1px 1px 1px;
  border-radius: 3px 3px 0 0;
  background-color: rgb(255, 246, 243);
}
.new-user__label {
  padding: 0 4.5px;
  left: -4.5px;
  background: linear-gradient(90deg, #fa6f54, #e72c3c 102.04%);
  border-radius: 2px 2px 2px 0;
  position: absolute;
  top: -5px;
  color: #fff;
  font-size: 10px;
  font-weight: 400;
  line-height: 14px;
}
.coupon__main_p1 {
  color: rgb(246, 69, 30);
  font-weight: 600;
  font-size: 16px;
  margin-top: 5px;
}
.coupon__main_p2 {
  color: rgb(166, 62, 0);
  font-size: 14px;
  margin-top: 10px;
  line-height: 18px;
}
.click-hand {
  position: absolute;
  top: 37px;
  right: 0;
  width: 60px;
  height: 60px;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
  animation: breathe 1s cubic-bezier(0, 0, 0.01, 1) 0s infinite normal none;
  background-image: url("../assets/img/image/hand.png");
}
@keyframes breathe {
  0% {
    transform: scale(1);
  }
  33% {
    transform: scale(1.2);
  }
  to {
    transform: scale(1);
  }
}
.closeicon {
  cursor: pointer;
  position: absolute;
  font-size: 25px;
  color: #fff;
  right: -5px;
  top: -50px;
  z-index: 99;
}
</style>
